<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>01_回顾Object.defineProperty</title>
    <!-- 引入Vue -->
    <script type="text/javascript" src="../js/vue.js"></script>

</head>
<body>
    <!-- 准备好一个容器 -->
    <div id="root">

    </div>

</body>
    <script type="text/javascript">
        let num = 18;
        let person = {
            name:'张三',
            gender:'男',
            // age:18
        }

        //一下方式添加的属性不可以被枚举（遍历）
        Object.defineProperty(person,'age',{
            // value:18,
            // enumerable:true,    //控制属性是否可以被枚举  默认值false
            // writable:true,   //控制属性是否可以被修改   默认值false
            // configurable:true,   //控制属性是否可以被删除   默认值false  

            //当有人读取person的age属性时，get方法就会被调用，且返回值就是age的值
            get:function(){
                return num
            },
            //当有人修改person的age属性时，set方法被调用，且会收到修改的具体值
            set:function(value){
                console.log('有人修改了age属性，且值是',value)
                num = value
            }
        })

        // console.log(Object.keys(person))

        console.log(person)

    </script>

</html>